#header{
  font-family: 'PingFangSC-Light', 'PingFang SC', 'Helvetica Neue', 'Helvetica', 'STHeitiSC-Light', 'Arial', 'Microsoft Yahei', 'Noto Sans CJK SC', 'Noto Sans S Chinese', sans-serif;
  width:100%;
  position:relative;
  background-color:#fff;
  //background-color:#fff;
  .header_md{
    width: 100%;
    div{}
  }
}

//头部小屏
@media screen and (min-width:256px) {
  #header{
    height:48px;
    .header_sm{
      height:100%;position:relative;
      &::before{
        content:"";display: table;
      }
      .header_sm_img{
        width:72px;height:30px;
        background: url(../../../public/img/logo-sp.png) no-repeat;

        background-size:cover ;
        display: block;
        margin:9px auto 0;
      }
      .header_sm_nav{
        width:48px;height:48px;
        float:left;
        background: url(../../../public/img/icon-nav.png) no-repeat center center;
        background-size:24px;
        opacity:0.5;
      }
      .header_sm_nav.active{
        background: url(../../../public/img/icon-close.png) no-repeat center center;
        background-size:24px;
      }
      .header_sm_menu{
        position:absolute;top:48px;left:0;background-color: #fff;z-index:10;
        width:100%;
        .menu_ul{
          .menu_li{
            padding: 1px 0; border-top: 1px solid #e0e0e0;
            a,span{
              font-size: 15px;
              display:block;
              height:45px;
              line-height: 45px;
              &:before{
                content:"";
                opacity:0;
                background:url(../../../public/img/dot.png) no-repeat center center;
                background-size:8px;
                transition: 0.3s linear;
                display: inline-block;
                width:30px;height:45px;
                float:left;
              }
            }
            a.active{
              color:#c4bdb5;
              &:before{
                opacity:1;
              }
            }
            span{}
            .menu_li_ul{
              margin-left:30px;
              display: none;
              top:48px;left:0px;
              .menu_li_item{
                height:48px;padding: 1px 0; border-top: 1px solid #e0e0e0;
              }
            }
          }
          .menu_li.active{
            span{
              color:#c4bdb5 !important;
              &:before{
                opacity:1 !important;
              }
            }
            .menu_li_ul{
              display: block;

            }
          }
        }
        .menu_search{
          position:fixed;bottom:0;left:0; border-top: 1px solid #e0e0e0;width:100%;
          background-color: #fff;
          height:71px;
          .search_main{
            margin:15px auto 0;width:95%;position:relative;
            .search_icon{
              position:absolute;
              top:0;left:0;
              width:32px;height:44px;
              background: url(../../../public/img/icon-search.png) no-repeat center center;
              background-size:24px;
              opacity:0.5;
            }
            input{
              border:none;outline:none;box-sizing: border-box;
              height:44px;width:100%;
              border-bottom:1px solid #000;
              padding:6px 28px;
            }
          }
        }
      }
    }
  }
}
//头部中屏
@media screen and (min-width:960px) {
  #header{
    height:92px;
    padding-top:12px;
    .header_nav{
      width:760px;height:80px; margin:0 auto;
      display: flex;align-items: center;justify-content: space-between;
      .nav_li{
        .a_img1{
          width:154px;height:75px;line-height:75px;
        }
        img{width:154px;height:68px;display: block}
        a{
          font-size:15px;  color:#1e1e1e;line-height: 30px;display:inline-block;
          >span{width:8px;height:8px;border-radius: 50%;background-color: #fff;
          }
        }
        //当.nav_a停留是，下面的span 必然变色
        a:hover{
          color:#c4bdb5;
          >span{
            background-color:#c4bdb5 ;
          }
        }
        .a1{
          position:relative;
          >.span1{
            position: absolute;left:50%;bottom:-8px;margin-left:-4px;
          }
        }
      }
    }
    .header_search{
      position:absolute;top:37px;width:32px;height:32px;right:16px;
      background: url(../../../public/img/icon-search.png) no-repeat;
      background-size:cover ;
      opacity:0.5;
      &:hover{
        opacity:1;
      }
    }
    .search_input{
      transition:0.5s linear;
      width:0px;
      //width:92%;
      position: absolute;top:37px;height:32px;right:50px;
      border-bottom:1px solid #000;background-color: #fff;overflow: hidden;
      .input_block{
        width:100%;position:relative;
      }
      .input_main{
        height:28px;border:none;outline:none;box-sizing: border-box;
        width:100%;padding-right:50px;padding-left:4px;
      }
      .input_close{
        position:absolute;top:0px;right:0px;
        width:32px;height:32px;
        background: url(../../../public/img/icon-close.png) no-repeat;
        background-size:cover ;
        opacity:0.5;
        &:hover{opacity:1}
      }
    }
  }
}
//头部大屏
@media screen and (min-width:1000px) {
  #header{
    .header_nav{
      width:820px;
    }
  }
}

.header_sm_menu.d-none{
  display:none !important;
}
.header_sm_menu{
  background-color:#fff;
}

@media screen and (min-width:960px) {
  .d_md960_none{
    display:none !important;
  }
}